/*
文件名称: query.js
完整存储路径: frontend/static/js/query.js
功能说明: 数据查询页面交互逻辑（配置驱动架构版）
更新日志: v2.0 - 完全配置驱动重构，使用FixedQueryArea组件
*/

document.addEventListener('DOMContentLoaded', function () {
  // 全局变量
  let queryFieldsConfig = null;
  let defaultColumnsConfig = null;
  let latestData = [];
  let currentPage = 1;
  const perPage = 10; // 🔧 修改：每页显示10条数据

  // DOM元素
  const resultTableHead = document.getElementById('resultTableHead');
  const resultTableBody = document.getElementById('resultTableBody');
  const pagination = document.getElementById('pagination');

  // ==================== 配置加载函数 ====================

  /**
   * 加载查询字段配置
   */
  async function loadQueryFieldsConfig() {
    try {
      const response = await fetch('/api/config/query-fields');
      const result = await response.json();
      if (result.success) {
        console.log('✅ 查询字段配置加载成功:', result.fields);
        return result.fields;
      } else {
        throw new Error(result.error || '查询字段配置加载失败');
      }
    } catch (error) {
      console.error('❌ 查询字段配置加载失败:', error);
      throw error;
    }
  }

  /**
   * 加载默认列配置
   */
  async function loadDefaultColumnsConfig() {
    try {
      const response = await fetch('/api/config/default-columns');
      const result = await response.json();
      if (result.success) {
        console.log('✅ 默认列配置加载成功:', result.config);
        defaultColumnsConfig = result.config;
        return result.config;
      } else {
        throw new Error(result.error || '默认列配置加载失败');
      }
    } catch (error) {
      console.error('❌ 默认列配置加载失败:', error);
      // 🔧 修复：移除硬编码，抛出错误让上层处理
      throw error;
    }
  }

  // ==================== 查询相关函数 ====================

  /**
   * 获取查询参数
   */
  function getQueryParams() {
    const params = new URLSearchParams();
    const queryInputs = document.querySelectorAll('#fixedQueryArea input, #fixedQueryArea select');
    queryInputs.forEach(input => {
      if (input.value && input.name) {
        params.append(input.name, input.value.trim());
      }
    });
    return params;
  }

  /**
   * 查询按钮回调
   */
  function onSearch(params) {
    console.log('🔍 执行查询:', params);
    currentPage = 1;
    fetchData(params);
  }

  /**
   * 清除按钮回调
   */
  function onClear() {
    console.log('🧹 清除查询条件');
    currentPage = 1;
    // 清空表格
    resultTableHead.innerHTML = '<tr><th class="text-muted">请选择查询条件并点击查询</th></tr>';
    resultTableBody.innerHTML = '';
    pagination.innerHTML = '';
  }

  /**
   * 获取列显示名称
   */
  function getColumnDisplayName(columnName) {
    if (defaultColumnsConfig && 
        defaultColumnsConfig.field_display_mapping && 
        defaultColumnsConfig.field_display_mapping[columnName]) {
      return defaultColumnsConfig.field_display_mapping[columnName];
    }
    return columnName;
  }

  /**
   * 获取选中的列
   */
  function getSelectedColumns() {
    const selected = [];
    // 优先从FixedQueryArea的列配置中获取
    const columnCheckboxes = document.querySelectorAll('.column-checkbox:checked');
    if (columnCheckboxes.length > 0) {
      columnCheckboxes.forEach((cb) => {
      selected.push(cb.value);
    });
    return selected;
  }

    // 🔧 修复：如果没有选中任何列，从配置中获取默认列
    if (defaultColumnsConfig && defaultColumnsConfig.default_selected) {
      return [...(defaultColumnsConfig.always_visible || []), ...defaultColumnsConfig.default_selected];
    }
    
    // 如果配置加载失败，返回空数组
    return [];
  }

  // ==================== 表格渲染函数 ====================

  /**
   * 渲染表格
   */
  function renderTable(data) {
    const selectedColumns = getSelectedColumns();
    
    if (selectedColumns.length === 0) {
      // 🔧 修复：如果没有选中列，显示提示信息而不是硬编码默认列
      resultTableHead.innerHTML = '<tr><th class="text-muted">请通过列配置选择要显示的字段</th></tr>';
      resultTableBody.innerHTML = '';
      return;
    }

    // 生成表头
    let headerHTML = "<tr>";
    selectedColumns.forEach((columnName) => {
      const displayName = getColumnDisplayName(columnName);
      headerHTML += `<th data-column="${columnName}">${displayName}</th>`;
    });
    headerHTML += "</tr>";
    resultTableHead.innerHTML = headerHTML;

    // 生成表格内容
    let bodyHTML = "";
    data.forEach((record) => {
      bodyHTML += "<tr>";
      selectedColumns.forEach((col) => {
        let cellData = record[col] !== undefined ? record[col] : "";
        bodyHTML += `<td data-column="${col}">${cellData}</td>`;
      });
      bodyHTML += "</tr>";
    });
    resultTableBody.innerHTML = bodyHTML;
  }

  /**
   * 渲染分页
   */
  function renderPagination(total) {
    pagination.innerHTML = "";
    const totalPages = Math.ceil(total / perPage);
    for (let i = 1; i <= totalPages; i++) {
      const li = document.createElement("li");
      li.className = "page-item" + (i === currentPage ? " active" : "");
      li.innerHTML = `<a class="page-link" href="#">${i}</a>`;
      li.addEventListener("click", function (e) {
        e.preventDefault();
        currentPage = i;
        fetchData();
      });
      pagination.appendChild(li);
    }
  }

  // ==================== 数据获取函数 ====================

  /**
   * 获取数据
   */
  function fetchData(params = null) {
    // 🔧 修复：确保searchParams是URLSearchParams对象
    let searchParams;
    if (params instanceof URLSearchParams) {
      searchParams = params;
    } else if (params && typeof params === 'object') {
      // 如果是普通对象，转换为URLSearchParams
      searchParams = new URLSearchParams();
      Object.entries(params).forEach(([key, value]) => {
        if (value !== null && value !== undefined && value !== '') {
          searchParams.append(key, value);
        }
      });
    } else {
      // 如果没有参数，使用getQueryParams()
      searchParams = getQueryParams();
    }
    
    searchParams.append("page", currentPage);
    searchParams.append("per_page", perPage);
    
    // 添加选中的列
    const selectedColumns = getSelectedColumns();
    if (selectedColumns.length > 0) {
      searchParams.append("columns", selectedColumns.join(","));
    }

    console.log('🔍 查询参数:', searchParams.toString());
    console.log('📊 当前选中列:', selectedColumns);

    fetch("/api/students/query?" + searchParams.toString())
      .then((response) => response.json())
      .then((result) => {
        if (result.students && result.students.length > 0) {
          console.log("【API返回样例】", result.students[0]);
        } else {
          console.log("【API返回样例】无数据");
        }
        
        if (result.error) {
          alert("查询错误: " + result.error);
          return;
        }
        
        latestData = result.students;
        // 🔧 确保latestData被正确挂载到全局
        window.latestData = latestData;
        
        renderTable(latestData);
        renderPagination(result.total);
        
        console.log('✅ 数据获取完成，记录数:', latestData.length);
      })
      .catch((err) => {
        console.error("查询请求错误:", err);
        alert("查询请求错误，请检查控制台");
      });
  }

  /**
   * 导出数据
   */
  function exportData() {
    const params = getQueryParams();
    const selectedColumns = getSelectedColumns();
    if (selectedColumns.length > 0) {
      params.append("columns", selectedColumns.join(","));
    }
    const url = "/api/students/export?" + params.toString();
    window.location.href = url;
  }

  // ==================== 初始化函数 ====================

  /**
   * 初始化页面
   */
  async function initializePage() {
    try {
      console.log('🚀 开始初始化查询页面...');
      
      // 1. 加载查询字段配置
      queryFieldsConfig = await loadQueryFieldsConfig();
      
      // 2. 加载默认列配置
      await loadDefaultColumnsConfig();
      
      // 3. 定义导出按钮配置
      const exportButtonConfig = {
        text: "导出Excel",
        className: "btn btn-success btn-sm",
        onclick: function() {
          console.log('📊 开始导出Excel...');
          exportData();
        }
      };
      
      // 4. 渲染查询区域
    if (window.renderFixedQueryArea) {
      window.renderFixedQueryArea(
        queryFieldsConfig,
        "fixedQueryArea",
        onSearch,
          onClear,
          true, // 启用列配置
          [exportButtonConfig] // 添加导出按钮
      );
        console.log('✅ FixedQueryArea渲染成功');
    } else {
        console.error('❌ FixedQueryArea.js 未正确加载');
      }
      
      // 5. 执行首次查询
      fetchData();
      
      console.log('✅ 查询页面初始化完成');
    } catch (error) {
      console.error('❌ 页面初始化失败:', error);
      alert('页面初始化失败，请刷新页面重试');
    }
  }

  // ==================== 全局函数挂载 ====================

  // 挂载到全局，供其他模块调用
  window.fetchData = fetchData;
  window.exportData = exportData;
  window.getSelectedColumns = getSelectedColumns;
  window.renderTable = renderTable;
  window.latestData = latestData;

  // ==================== 启动初始化 ====================

  // 页面加载完成后初始化
  initializePage();
});
